<template>
    <view class="tab-bar">
        <view v-for="(item,index) in list" :key="index" class="tab-bar-item" @click="switchTab(item, index)">
            <image class="tab_img" :src="currentIndex == index ? item.selectedIconPath : item.iconPath"></image>
            <view class="tab_text" :style="{color: currentIndex == index ? selectedColor : color}">{{item.text}}</view>
        </view>
    </view>
</template>

<script>
    export default {
        props: {
            selectedIndex: { // 当前选中的tab index
               
            },
        },
        data() {
            return {
                color: "#666666",
                selectedColor: "#00BAB2",
                list: [],
                currentIndex:0,
            }
        },
		
        created() {
			
            this.currentIndex = this.selectedIndex;
            // console.log( this.currentIndex,this.selectedIndex,'index');
            var _this = this
            _this.list = [
            	{
            		"pagePath": "/extra/institutehome/institutehome",
            		"iconPath": "/static/tab-bar/home.png",
            		"selectedIconPath": "/static/tab-bar/home-selected.png",
            		"text": "首页"
            	},
            	
            	{
            		"pagePath": "/extra/classlist/classlist",
            		"iconPath": "/static/tab-bar/kecheng-selected.png",
            		"selectedIconPath": "/static/tab-bar/kecheng.png",
            		"text": "课程"
            	},
            	// {
            	// 	"pagePath": "/extra/talkindex/talkindex",
            	// 	"iconPath": "/static/tab-bar/information.png",
            	// 	"selectedIconPath": "/static/tab-bar/information-selected.png",
            	// 	"text": "TALK"
            	// },
				// {
				// 	"pagePath": "/pages/user/user",
				// 	"iconPath": "/static/tab-bar/mine.png",
				// 	"selectedIconPath": "/static/tab-bar/mine-selected.png",
				// 	"text": "我的"
				// }
            ]
           
        },
        methods: {
            switchTab(item, index) {
				console.log(item,index);
                this.currentIndex = index;
                
                let url = item.pagePath;
				 
                // uni.reLaunch({url:item.pagePath})
				// uni.navigateTo({
				// 	url:item.pagePath
				// })
				uni.redirectTo({
					url:item.pagePath
				})
				
				
            }
        }
    }
</script>

<style lang="scss">
    .tab-bar {
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        padding: 20rpx 0;
        background: white;
        display: flex;
        justify-content: center;
        align-items: center;
        padding-bottom: env(safe-area-inset-bottom); // 适配iphoneX的底部
        z-index: 999;
        .tab-bar-item {
            flex: 1;
            text-align: center;
            display: flex;
            justify-content: center;
            align-items: center;
            flex-direction: column;
            .tab_img {
                width: 54rpx;
                height: 54rpx;
            }
            .tab_text {
                font-size: 20rpx;
                margin-top: 9rpx;
            }
        }
    }
</style>